<template>
  <div id="my-bid" v-if="myParticipateAuction.data != null">
    <!-- <FilterBar /> -->
    <div class="bids-box" v-if="myParticipateAuction.data.length != 0">
      <el-row :gutter="30">
        <el-col :xs="24" :sm="12" :md="6" :xl="4" v-for="bid in myParticipateAuction.data" :key="bid.id"
          ><AuctionItem :art="bid"
        /></el-col>
      </el-row>
    </div>
    <div class="no-result" v-if="myParticipateAuction.data.length == 0">
      <span>什么都没找到</span>
    </div>
    <!-- <div class="item-box">
      <ArtItem
        :artData="item"
        class="art-item"
        v-for="item in bids"
        :key="item.id"
        type="my"
      />
    </div>
    <div class="no-result" v-if="bids.length == 0">
      <span>什么都没找到</span>
    </div> -->
  </div>
</template>

<script>
import ArtItem from "@/components/ArtItem";
import FilterBar from "@/components/FilterBar";
import AuctionItem from "@/components/AuctionItem";
import { mapState } from "vuex";
export default {
  name: "MyBid",
  components: {
    ArtItem,
    FilterBar,
    AuctionItem,
  },
  mounted() {
    this.$store.dispatch('myParticipateAuction', this.$store.getters.user_address)
  },
  computed:{
    ...mapState({
      myParticipateAuction:store=>store.user.myParticipateAuction
    })
  }
};
</script>

<style lang='less'>
#my-bid {
  min-height: 200px;
  .bids-box {
    margin-top: 20px;
    padding: 0 40px;
  }
}
</style>